﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>订单列表</title>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="../css/ydui.css?v=1.1.4" rel="stylesheet" />
    <script src="../js/ydui.flexible.js"></script>
    <link rel="stylesheet" type="text/css" href="../css/all.css?v=20180302" />
</head>
<body ms-controller="orderlist" class="ms-controller" style="background: #F7F7F7;">
    <div class="g-flexview">
        <header class="m-navbar">
            <a onclick="history.back()" class="navbar-item"><i class="back-ico"></i></a>
            <div class="navbar-center"><span class="navbar-title">{{@DTitle}}</span></div>
        </header>
        <!--<ul class="tab-nav">
            <li class="tab-nav-item" ms-class="[@status==''&&'tab-active']" ms-on-tap="@Query('')"><a href="javascript:;">全部</a></li>
            <li class="tab-nav-item" ms-class="[@status=='0'&&'tab-active']" ms-on-tap="@Query('0')"><a href="javascript:;">待付款</a></li>
            <li class="tab-nav-item" ms-class="[@status=='2'&&'tab-active']" ms-on-tap="@Query('2')"><a href="javascript:;">待收货</a></li>
        </ul>-->
               
        <section class="g-scrollview">
			<div class="order-five">
				<ul>
					<li ms-for="el in @ListData">
						<div class="order-head clearfix">
							<p class="order-number fl">订单号：{{el.ID}}</p>
							<p class="order-state fr">{{@ShowStatus(el.Status)}}</p>
						</div>
						<a ms-attr="{'href':'detail.html?id='+el.ID}">
							<div class="order-center clearfix">
								<div class="order-detail"  ms-for="($index,im) in el.SubItem" ms-if="el.SubItem.length==1">
									<div class="order-img">
										<img ms-attr="{'src':ComFunJS.FilePath(im.ImgUrl,'/142/142')}">
									</div>
									<div class="order-text">
										<p>{{im.Title}}</p>
									</div>	
								</div>
								<img ms-for="($index,im) in el.SubItem"  ms-attr="{'src':ComFunJS.FilePath(im.ImgUrl,'/142/142')}" ms-if="$index<=2 && el.SubItem.length>1">
								<p class="fr" ms-if="el.SubItem.length>=3">共{{el.Qty}}件商品<span class="iconfont icon-gengduo"></span></p>
							</div>
						</a>
						<p class="order-payment">共{{el.Qty}}件商品 合计：<span style="color:#9a1512"><i>¥</i>{{el.SumPrice}}</span></p>
						<div class="order-again">
							<a ms-if="el.Status==2">查看物流</a>
							<a class="change" ms-if="el.Status==2" ms-on-tap="@ConfirmOrder(el)">确认收货</a>
                            <a style="display:block;" ms-if="el.Status==0" ms-on-tap="@CancelOrder(el)">取消订单</a>
                            <a class="change" ms-if="el.Status==0&&el.PayStatus==0" style="display:block;" ms-attr="{'href':'pay.html?id='+el.ID}">去支付</a>
						</div>						
					</li>
				</ul>
			</div>	
			<!--<div class="order-third">
				<ul>
					<li ms-for="el in @ListData">
						<div >
							<p class="order-logo">
                                订单号：{{el.ID}}
                              <span style="float:right;">{{@ShowStatus(el.Status)}}</span>
                            </p>
							<a class="order-detail" ms-attr="{'href':'detail.html?id='+el.ID}" ms-for="im in el.SubItem">
								<div class="order-img">
									<img ms-attr="{'src':ComFunJS.FilePath(im.ImgUrl,'/145/145')}">
								</div>
								<div class="order-text">
									<p>{{im.Title}}</p>
								</div>	
								<p class="order-price" style="color: #ff3e3e;">¥{{im.Price1}}<i>×{{im.Qty}}</i></p>
							</a>
							<p class="order-payment">共{{el.Qty}}件商品 合计：<span style="color:#ff0000"><i>¥</i>{{el.SumPrice}}</span></p>
							<div class="order-again">
								<a ms-if="el.Status==2">查看物流</a>
								<a class="change" ms-if="el.Status==2" ms-on-tap="@ConfirmOrder(el)">确认收货</a>
                                <a style="display:block;" ms-if="el.Status==0" ms-on-tap="@CancelOrder(el)">取消订单</a>
                                <a class="change" ms-if="el.Status==0&&el.PayStatus==0" style="display:block;" ms-attr="{'href':'pay.html?id='+el.ID}">去支付</a>
							</div>
						</div>
					</li>			
				</ul>
			</div>		-->
			
			<div class="order_no" ms-if="@ListData.length==0">
				<img src="../img/ordernone_03.png"/>
			</div>
        </section>
       

    </div>
    <script src="//cdn.bootcss.com/jquery/2.0.0/jquery.min.js"></script>
    <script src="../js/ydui.js"></script>
    <script src="../js/avalon.mobile.min.js"></script>
    <script src="../js/ComFunJS.js?v=20180331"></script>
    <script>
    	
        var model = avalon.define({
            $id: "orderlist",
            ListData: [],
            pageindex: 1,
            total:0,
            status: ComFunJS.getQueryString("status",""),
            GetListData: function (callback) {
                $.getJSON("/api/order/list/1/" + model.status, { "pageindex": model.pageindex }, function (r) {
                    if (r.error == "") {
                        model.total = r.total;
                        typeof callback == 'function' && callback.call(this, r.result);
                    }
                })     
            },
            Query: function (s) {
                model.status = s;
                init();

            },
            DTitle: "全部订单",
            ShowStatus: function (s) {
                var st = "";
                switch (s) {
                    case 0:
                        st = "待付款";
                        break;
                    case 1:
                        st = "待发货";
                        break;
                    case 2:
                        st = "待收货";
                        break;
                    case 3:
                        st = "确认收货";
                        break;
                    case 9:
                        st = "已取消";
                        break;
                }
                return st;
            },
            CancelOrder: function (el) {
                YDUI.dialog.confirm("", "确定要取消该订单吗?", function () {
                    $.getJSON("/api/order/cancel/" + el.ID, function (r) {
                        if (r.error == "") {
                            el.Status = 9;
                            YDUI.dialog.toast("订单取消成功", "none", 1000);
                        }
                    })
                })

            },
            ConfirmOrder: function (el) {
                YDUI.dialog.confirm("", "确定收到货了吗?", function () {
                    $.getJSON("/api/order/receive/" + el.ID, function (r) {
                        if (r.error == "") {
                            el.Status = 3;
                            YDUI.dialog.toast("订单收货成功", "none", 1000);
                        }
                    })
                })

            }
        })
        avalon.ready(function () {
            if (model.status) {
                if (model.status == 0) {
                    model.DTitle = "待付款";
                } else if (model.status == "1") {
                    model.DTitle = "待发货";
                } else if (model.status == "2") {
                    model.DTitle = "待收货";
                }
            }
            //if (ComFunJS.isLogin(true)) {
            init();
            //}

        })

        function init() {
            model.ListData.clear();
            model.pageindex = 1;

            $('.order-five').infiniteScroll({
                binder: '.g-scrollview',
                pageSize: 10,
                initLoad: true,
                backposition: true,
                jumpLink: '.J_Link',
                loadingHtml: '<img src="http://static.ydcss.com/uploads/ydui/loading/loading10.svg"/>',
                loadListFn: function () {
                    var def = $.Deferred();

                    model.GetListData(function (listArr) {
                        model.ListData.pushArray(listArr);
                        //$('.m-list').find('img').lazyLoad({ binder: '.g-scrollview' });

                        def.resolve(listArr, model.pageindex);
                        model.pageindex++;
                    })

                    return def.promise();
                },
                loadStorageListFn: function (ret, retPage) {
                    var def = $.Deferred();
                    model.pageindex = retPage;
                    ret.forEach(function (listArr) {
                        listArr.list.forEach(function (val) {
                            model.ListData.push(val);
                        });
                    });
                    model.total = model.ListData.length;
                    //$('.m-list').find('img').lazyLoad({ binder: '.g-scrollview' });
                    def.resolve();
                    return def.promise();
                }
            })

        }


    </script>
</body>
</html>
